import React from "react";

export default class ComponentLife extends React.Component{

    constructor(props){
        super(props);

        this.state={count:0}
    }

    //渲染
    render(){
        //es6语法，结构赋值
        const{ count }=this.state;
        return (
            <div>
                <h1>生命周期 { count }</h1>
                <h2>父页面的Title:{ this.props.title }</h2>
                <button onClick={this.changeHandle}>结构赋值</button>
                <button onClick={this.changeTitle}>修改title</button>
            </div>
        )
    }

    changeHandle=()=>{
        this.setState({
            count:this.state.count+1
        })
    }
    changeTitle=()=>{
        this.props.changeFuTitle('子组件传过来的值')
    }


    componentWillMount(){
        console.log('1.componentWillMount')
    }
    componentDidMount(){
        console.log('2.componentDidMount')
    }
    shouldComponentUpdate(){
        console.log('3.shouldComponentUpdate')
        return true;
    }
    componentWillUpdate(){
        console.log('4.componentWillUpdate')
    }
    componentDidUpdate(){
        console.log('5.componentDidUpdate')
    }
    componentWillReceiveProps(){
        console.log('6.componentWillReceiveProps')
    }
    componentWillUnmount(){
        console.log('7.componentWillReceiveProps')
    }
}